<template>
  <div v-if="viewpageShow">
    <el-dialog title="图纸下载" :visible.sync="viewpageShow" width="65%" append-to-body>
      <basic-container>
        <el-form :inline="true" :model="formInline" class="demo-form-inline" size="small" ref="searchForm"
          style="margin-top: 30px">
          <el-divider content-position="left">基本信息</el-divider>
          <el-row style="margin-top: 30px">
            <el-col :span="6">
              <el-form-item label="设备代号" prop="drawingNumber">
                <el-input placeholder="设备代号" clearable v-model="formInline.drawingNumber" disabled></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="设备名称" prop="drawingName">
                <el-input placeholder="设备名称" clearable v-model="formInline.drawingName" disabled></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="设备材料" prop="material">
                <el-input placeholder="设备材料" clearable v-model="formInline.material" disabled></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="图纸备注" prop="drawingRemark">
                <el-input v-model="formInline.drawingRemark" placeholder="请选择图纸备注" clearable disabled></el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="6">
              <el-form-item label="特征值一" prop="characOne">
                <el-input placeholder="特征值一" clearable v-model="formInline.characOne" disabled></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="特征值二" prop="characTwo">
                <el-input placeholder="特征值二" clearable v-model="formInline.characTwo" disabled></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="特征值三" prop="characThree">
                <el-input placeholder="特征值三" clearable v-model="formInline.characThree" disabled></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="图纸类型" prop="drawingType">
                <el-input v-model="formInline.drawingType" placeholder="请选择图纸类型" clearable disabled></el-input>
              </el-form-item>
            </el-col>

          </el-row>
          <el-divider content-position="left"></el-divider>
          <el-row>
            <el-col :span="10">
              <el-button type="primary" plain size="small" icon="el-icon-download" @click="soloDrawing">单张下载</el-button>
              <!-- <el-button type="primary" plain size="small" icon="el-icon-download" @click="singleDrawing">单级下载
              </el-button> -->
              <el-button type="primary" plain size="small" icon="el-icon-download" @click="allDrawing">整套下载</el-button>
            </el-col>
          </el-row>

        </el-form>
      </basic-container>
    </el-dialog>
  </div>
</template>

<script>
  import { getDrawingInfoByNodeId } from "@/api/resource/attach";
  import { getToken } from '@/util/auth';
  export default {
    name: "uploadfile",
    data() {
      return {
        formInline: {
          drawingNumber: '',
          drawingName: '',
          material: '',
          drawingProperty: '',
          drawingRemark: '',
          characOne: '',
          characTwo: '',
          characThree: '',
          drawingType: '',
        },
        drawId: '',
        viewpageShow: false,
      }
    },
    // created() {
    //   this.getDetail();
    // },
    methods: {
      setDrawId(id) {
        this.drawId = id;
      },
      getDetail() {
        getDrawingInfoByNodeId(this.drawId).then(res => {
          this.formInline = res.data.data;
        });
        this.viewpageShow = true
      },
      // 单张图纸下载
      soloDrawing() {
        // window.open(`/api/data-drawing-info/drawinginfo/getSoloDrawing?${this.website.tokenHeader}=${getToken()}&infoId=` + this.drawId + `&downType=1`);
        this.downloadAttach(`/api/data-drawing-info/drawinginfo/getSoloDrawing?infoId=` + this.drawId + `&downType=1`)
      },
      // 单极图纸
      singleDrawing() {
        // window.open(`/api/data-drawing-info/drawinginfo/getSoloDrawing?${this.website.tokenHeader}=${getToken()}&infoId=` + this.drawId + `&downType=2`);
        this.downloadAttach(`/api/data-drawing-info/drawinginfo/getSoloDrawing?infoId=` + this.drawId + `&downType=2`)
      },
      // 整套图纸下载
      allDrawing() {
        // window.open(`/api/data-drawing-info/drawinginfo/getSoloDrawing?${this.website.tokenHeader}=${getToken()}&infoId=` + this.drawId + `&downType=3`);
        this.downloadAttach(`/api/data-drawing-info/drawinginfo/getSoloDrawing?infoId=` + this.drawId + `&downType=3`)
      },
      downloadAttach(url){
        this.axios
        .get(url, {
            headers: {
                'Content-Type': "application/x-download",
                token: sessionStorage.getItem('token') 
            },
            responseType: 'blob'
        })
        .then(res => {
          const responseType = res.data.type;
          
          if (responseType.includes('application/x-download')) { // 响应类型为rar文件
            var filename = decodeURI(res.headers["content-disposition"].split("filename=")[1])
            let blob = new Blob([res.data], {
                type: 'application/x-rar-compressed'
              });
              if (window.navigator.msSaveOrOpenBlob) {
                  // 兼容IE10
                  window.navigator.msSaveBlob(blob);
              } else {
                  //  兼容chrome/firefox
                  let aTag = document.createElement('a');
                  aTag.download = filename;
                  aTag.href = window.URL.createObjectURL(blob);
                  aTag.click();
                  URL.revokeObjectURL(aTag.href);
              }
            return
          }
          if (responseType.includes('application/json')) { //响应类型为json
            var reader = new FileReader()
            reader.readAsArrayBuffer(res.data);
            reader.onload  = e => {
              var init = new Uint8Array(e.target.result);
              var result = JSON.parse(new TextDecoder('UTF-8').decode(init));
              this.$message.error(result.data)
            }
          }
        })
        .catch(function(message) {
          debugger
            //如果不能正常下载给出对应提示
            this.$warning.error(message)
        });
      },
    },
  }
</script>

<style scoped>

</style>